// ╔═══════════════════════════════════════════════════════════════════════════╗
//                                样式管理基类
// ╚═══════════════════════════════════════════════════════════════════════════╝
export class DefaultStyleManager {

    constructor(plugin) {
        this.plugin = plugin;
        this._styleElements = new Map();   // 样式类型
        this._baseStyleId = 'base-styles'; // 基础样式唯一标识
        this.keepBaseStyles = true;        // 是否保留基础样式
    }

    /**
     * 注册所有样式（基础 + 动态）
     */
    registerStyles() {
       // 确保基础样式只注入一次
        if (!this._styleElements.has(this._baseStyleId)) {
            this._injectStyles(this._getBaseStyles(), this._baseStyleId);
        }
        this.updateStyles(); // 初始化动态样式
    }

    /**
     * 动态更新样式（可保留原有样式元素）
     */
    updateStyles() {
        // 清除旧动态样式（保留基础样式）
        this._clearStyles(this.keepBaseStyles);

        // 注入新动态样式
        const dynamicStyles = this.getDynamicStyles();
        if (dynamicStyles) {
            this._injectStyles(dynamicStyles, 'dynamic-styles');
        }
    }

    /**
     * 注入样式
     * @param {string} css 样式内容
     * @param {string} styleType 样式类型标识
     */
    _injectStyles(css, styleType) {
        if (!css || this._styleElements.has(styleType)) return;

        const styleTag = document.createElement('style');
        styleTag.id = `${this.plugin.config.SELECTOR}-${styleType}`;
        styleTag.textContent = css;
        document.head.appendChild(styleTag);
        this._styleElements.set(styleType, styleTag);
    }

    /**
     * 清除样式（可选保留基础样式）
     * @param {boolean} keepBase 是否保留基础样式
     */
    _clearStyles(keepBase = true) {
        for (const [type, el] of this._styleElements) {
            if (!(keepBase && type === this._baseStyleId)) {
                el.remove();
                this._styleElements.delete(type);
            }
        }
    }
    /**
     * 基础样式
     */
    _getBaseStyles() {
        return `
            /* 提示信息样式 */
            .config-hint {
                color: #b780ff;
                font-size: 0.85em;
                margin-left: 8px;
                opacity: 1 !important;
            }
            .hint-text {
                animation: fadeIn 0.5s ease-out;
            }
            @keyframes fadeIn {
                from { opacity: 0; transform: translateY(2px); }
                to { opacity: 1; transform: translateY(0); }
            }
        `
    }

    /**
     * 动态样式
     */
    getDynamicStyles() {
        return '';
    }

    /**
     * 销毁所有样式
     */
    dispose() {
        this._clearStyles(false);
    }
}

// ╔═══════════════════════════════════════════════════════════════════════════╗
//                                布局管理基类
// ╚═══════════════════════════════════════════════════════════════════════════╝
export class DefaultLayoutManager {

    constructor(plugin) {
        this.plugin = plugin;
    }

    /**
     * 初始化布局
     */
    initLayout() {}

    /**
     * 更新布局
     * @param {boolean} reset 是否重置布局
     */
    updateLayout(reset=false) {}
}

// ╔═══════════════════════════════════════════════════════════════════════════╗
//                                组件管理基类
// ╚═══════════════════════════════════════════════════════════════════════════╝
export class DefaultComponentManager {

    constructor(plugin) {
        this.plugin = plugin;
    }

    /**
     * 注册组件
     */
    registerComponents() {}
}